<template>
  <div id="App">
    <button v-for="(tab,index) in btnTabs" :key="index" @click="handler(tab)">{{tab}}</button>
    <component :is="currentTab"></component>
  </div>
</template>
<script>
import home from "@/components/home.vue";
import about from "@/components/about.vue";
import category from "@/components/category.vue";
export default {
  name: "App",
  data() {
    return {
      btnTabs:["home","about","category"],
      currentTab:"home"
    }
  },
  methods:{
    handler(tab){
      this.currentTab=tab
    }
  },
  components:{home, about, category}
}
</script>
<style lang="less">

</style>
